<!doctype html>
<html lang="en" ng-app="reminder">
<head>
    <meta charset="UTF-8">
    <title>icloud 提醒事项</title>
    <link rel="stylesheet" href="css/index.css">
    <link rel="shortcut icon" href="./imgs/favicon.ico" type="image/x-icon">
    <script src="js/jquery.js"></script>
    <script src="js/angular.js"></script>
    <script src="js/angular-animate.js"></script>
    <script src="js/index.js"></script>
</head>
<body ng-controller="main" ng-click="tiaojian=false">
    <div class="reminder">
        <div class="lists">
            <div class="header">
                <div class="logo"></div>
                <div class="title">提醒事项</div>
                <div class="jia" ng-click="add();save()">
                    <div class="jia-icon"></div>
                </div>
              
            </div>
            <div class="plan">
                <div class="plan-icon"></div>
                <span>已计划</span>
                <div class="xian"></div>
            </div>
            <div my-ul>
                <li ng-repeat="v in database track by $index " ng-click="click($index)" ng-class="{'active':(v===currentlist)}">
                    <div class="color">
                        <div class="color-icon" ng-class="v.theme"></div>
                    </div>
                    <input type="text" value="" ng-model="v.listsName" ng-change="save()">
                    <div class="xian"></div>
                </li>
            </div>
        </div>


        <div class="content" ng-init="tiaojian=false" ng-init="ed=false">
            <div class="header">
                <div class="search">
                    <div class="search-icon"></div>
                </div>
                <input type="text" placeholder="搜索所有提醒">
                <div class="yhm">
                    <div class="mz">张皓
                    <div class="chevron"></div>
                    </div>
                    <div class="shuxian"></div>
                    <div class="wenhao">
                        <div class=" help-icon"></div>
                    </div>
                </div>
            </div>
            <div class="content-inner" >
                <div class="title" ng-class="currentlist.theme">
                    <h2>{{currentlist.listsName}}</h2>
                    <div class="button" ng-click="tiaojian=true;clacel($event)">选项</div>
                    <div class="color-list" ng-class="{xianshi:tiaojian}"ng-click="clacel($event)"  >
                        <div class="color-inner">
                            <input type="text" ng-model="currentlist.listsName" ng-change="save()">
                            <p class="color-text">列表颜色</p>
                            <ul class="color">
                                <li ng-repeat="v in color" class="{{v}}" ng-class="{active:v===currentlist.theme}" ng-click="currentlist.theme=v;save()">
                                      <div class="sekuai"></div>
                                </li>
                            </ul>
                            <span class="delete" ng-click="tiaojian=false;delete(currentlist.id);save()" >删除</span>
                            <span class="quxiao" ng-click="tiaojian=false">取消</span>
                            <span class="wangche" ng-click="tiaojian=false">完成</span>
                        </div>
                        <div class="sc-pointer sc-point-right" style="top: 85px; background-image: url('./imgs/packed-5.png'); background-position: -80px -604px;background-repeat: no-repeat;position: absolute;width: 33px;height: 15px;right: -28px;margin-top: -8px;margin-left: -17px;z-index: 2;-webkit-transform: rotate(270deg);"></div>
                    </div>
                    <div class="xian"></div>
                </div>
                <ul class="Completed" ng-class="currentlist.theme" ng-init="ying=false">
                    <div class="header">
                        <div class="header-icon" ng-click="ying=!ying;dianji()"></div>
                        <span>已完成:  {{wangcheng()}}  项</span>
                        <div class="clear"><lable class="lable1" ng-class="currentlist.theme"ng-click="delFinish();save()">清除已完成事项</lable></div>
                    </div>
                    <li ng-repeat="v in currentlist.todo|filter:{isDone:true}; track by $index" ng-init="showcale=false" ng-init="shanchu=false" ng-show="ying">
                        <div class="jiayige" ng-show="showcale"></div>
                         <div class="button" ng-click="v.isDone=!v.isDone;save()" ng-class="currentlist.theme" ></div>
                        <input type="text" ng-model="v.name" ng-click="showcale=!showcale" ng-blur="showcale=false" ng-change="save()">
                          <div class="xian"></div>
                        <div class="delete" ng-click="ed=true" ng-show="showcale" ng-class="currentlist.theme">详情信息</div>
                        <div class="shanchu" ng-click="shanchu=true"></div>
                        <div class="xianqin" ng-show="shanchu">
                            <div class="xianqin-inner" >
                                <span class="delete" ng-click="shanchu=flase;schu(v.id);save()">删除</span>
                                <span class="wangche" ng-click="v.isDone=!v.isDone;shanchu=false;save()">完成</span>
                            </div>
                        </div>
                    </li>
                </ul>
                <!--<hr>-->
                <div class="header">
                    <div class="header-icon1" ng-click="dian()"></div>
                    <span>未完成:  {{weiwan()}}  项</span>
                </div>
                <ul class="noCompleted" ng-class="currentlist.theme">
                    <li ng-repeat="v in currentlist.todo|filter:{isDone:false}; track by $index" ng-init="showcale=false" ng-init="shanchu=false">
                        <div class="jiayige" ng-show="showcale"></div>
                        <div class="button" ng-click="v.isDone=!v.isDone;save()" ng-class="currentlist.theme"></div>
                        <input type="text" ng-model="v.name" ng-click="showcale=!showcale" ng-blur="showcale=false" ng-change="save()">
                        <div class="xian"></div>
                        <div class="delete" ng-click="ed=true" ng-show="showcale" ng-class="currentlist.theme">详情信息</div>
                        <div class="shanchu" ng-click="shanchu=true" ></div>
                        <div class="xianqin" ng-show="shanchu">
                            <div class="xianqin-inner" >
                                <span class="delete" ng-click="shanchu=false;schu(v.id);save()">删除</span>
                                <span class="wangche" ng-click="v.isDone=!v.isDone;shanchu=false;save()">完成</span>
                            </div>
                        </div>
                    </li>
                    <div class="header" ng-click="tianjia();save()">
                        <span>新条目</span>
                    </div>
                </ul>
            </div>
        </div>
    </div>
</body>
</html>